<template>
	<div class="app-container">
		<!-- 高级查询 -->
		<!-- <p>我要开单</p> -->
		<!-- <el-divider></el-divider> -->
		<!-- 	<el-steps :align-center="true" :active="active" finish-status="success">
			<el-step title="填写表单"></el-step>
			<el-step title="核对信息"></el-step>
			<el-step title="完成"></el-step>
		</el-steps> -->
		<!-- <el-divider></el-divider> -->
		<div v-if="active == 1">
			<!-- 	<div class="moneyBox">
				<div class="moneyChildBox">
					<div class="textAlLine eduTitle">预授信额度</div>
					<div class="titleNumber textAlLine"> {{ creditInfor.credit }}<span
							style="color: #818181;margin-left: 10px;">元</span> </div>
				</div>
				<div class="moneyChildBox">
					<div class="textAlLine eduTitle">可用额度</div>
					<div class="titleNumber textAlLine redColor">{{ creditInfor.creditLeft }}<span
							style="color: #818181;margin-left: 10px;">元</span> </div>
				</div>
				<div class="moneyChildBox">
					<div class="textAlLine eduTitle">已用额度</div>
					<div class="titleNumber textAlLine">46,568,54<span
							style="color: #818181;margin-left: 10px;">元</span> </div>
				</div>
				<div class="moneyChildBox">
					<div class="textAlLine eduTitle">冻结额度</div>
					<div class="titleNumber textAlLine">{{ creditInfor.frezeCredit }}<span
							style="color: #818181;margin-left: 10px;">元</span>
					</div>
				</div>
			</div> -->
			<!-- <el-divider></el-divider> -->
			<!-- <div class="contentBox"> -->
			<!-- <el-form :rules="rules" ref="form" :model="form" label-width="80px">
					<el-form-item label="收单企业">

						<el-select v-model="form.salerNo" style="width: 100%" filterable clearable
							placeholder="请选择收单企业">
							<el-option v-for="option in options.supplierIdOptions" :key="option.id"
								:label="option.supplierName" :value="option.id" />
						</el-select>
					</el-form-item>
					<!-- <el-form-item label="收单企业" prop="receiverNo">
						<el-select v-model="form.receiverNo" style="width: 100%" filterable clearable
							placeholder="请选择收单企业">
							<el-option v-for="option in options.supplierOptions" :key="option.id"
								:label="option.supplierName" :value="option.id" />
						</el-select>
					</el-form-item> -->
			<!-- 	<el-form-item label="惠单金额">
						<div style="display: flex;">
							<div>
								<el-input @input="smallToBig(form.amount)" style="width: 90px;" v-model="form.amount">
								</el-input>
							</div>
							<div style="font-weight: bold;margin-left: 10px;">RMB{{form.amount}}元</div>
							<div v-if="form.amount != ''" style="font-weight: bold;margin-left: 10px;">{{value}}</div>
						</div>

					</el-form-item>
					<el-form-item label="开单日">
						<el-col :span="10">
							<el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date" placeholder="选择日期"
								v-model="form.openDate" style="width: 90%;">
							</el-date-picker>
						</el-col>
						<el-col class="line" :span="4"> - 到期日 -</el-col>
						<el-col :span="10">
							<el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date" placeholder="选择日期"
								v-model="form.validatedTo" style="width: 100%;">
							</el-date-picker>
						</el-col>
					</el-form-item>
					<el-form-item label="合同编号">
						<el-input v-model="form.contractNo"></el-input>
					</el-form-item>
					<el-form-item label="发票号码" prop="invoiceNo">
						<el-input v-model="form.invoiceNo"></el-input>
					</el-form-item>
					<el-form-item label="备注">
						<el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容"
							v-model="form.remark">
						</el-input>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="submitForm('form')">立即创建</el-button>
					</el-form-item>
				</el-form> -->
			<!-- </div> -->
		</div>
		<div style="height: 500px;">
			<div v-if="finCreditBill.status == 'CREATED'" class="imgBg">
				<!-- 都不要章 -->
				<div class="xindanBox">
					<div class="topBox">
            <div class="billNo">
           <div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单号:</div>
            	<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
            		{{finCreditBill.creditBillNo }}</div>
            </div>
						<div class="toptitle">
							<div
								style="text-align: center;font-size: 23px;border-bottom: 1px solid #555555;margin-top: 10px;height: 40px;">
								惠单</div>
							<div style="text-align: center;font-size: 14px;margin-top: 20px;">
								开单日期：{{finCreditBill.openDate}}
							</div>
						</div>
						<div class="orderNo">
							<div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单状态:</div>
							<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
								{{finCreditBill.status|billStatusFilter }}</div>
						</div>
					</div>
					<div>
						<table width="90%" height="300" border="1" style="border-collapse: collapse;margin: 0 auto;">
							<tr>
								<th scope="col" width="15%">开单方</th>
								<th scope="col" width="35%">{{finCreditBill.buyerName}}</th>
								<th scope="col" width="15%">持单方</th>
								<th scope="col" width="35%">{{finCreditBill.salerName}}</th>
							</tr>
							<tr>
								<td>兑付日期</td>
								<td>{{finCreditBill.validatedTo}}</td>
								<td>期限</td>
								<td>{{finCreditBill.validateLength}}天</td>
							</tr>
							<tr>
								<td>金额</td>
								<td>
									<div style="display: flex;">
										<div>
											<p>人民币</p>
											<p>(大写)</p>
										</div>
										<h3 style="line-height: 50px;">{{value}}</h3>
									</div>

								</td>
								<td height="50" colspan="2">
									<table border="1" width="100%">
										<tr style="width: 100%;" height="50px">
											<th>亿</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>万</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>元</th>
										</tr>
										<tr height="50px">
											<td>{{a}}</td>
											<td>{{b}}</td>
											<td>{{c}}</td>
											<td>{{d}}</td>
											<td>{{e}}</td>
											<td>{{f}}</td>
											<td>{{g}}</td>
											<td>{{h}}</td>
											<td>{{i}}</td>
										</tr>
									</table>
								</td>
							<tr>
								<td>保贴方</td>
								<td>{{finCreditBill.baoliReceiverName}}</td>
								<td>兑付方式</td>
								<td>{{finCreditBill.paymentType}}</td>
							</tr>
							<tr>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">开单方承诺：本惠单到期无条件兑付</div>
										<!-- <img src="../../../assets/img/pass.png" width="100px" height="100px"> -->
									</div>
								</td>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">保贴方承诺：为本惠单无条件保贴</div>
										<!-- <img src="../../../assets/img/pass.png" width="100px" height="100px"> -->
									</div>
								</td>
							</tr>
							</tr>
						</table>
					</div>
				</div>
				<!-- 	<div style="margin: 0 auto;">
					<el-button @click="goBack">上一步</el-button>
					<el-button @click="confirm" type="primary">确认提交</el-button>
				</div> -->
			</div>

			<div v-else-if="finCreditBill.status == 'CHECKED'" class="imgBg">
				<!-- 要左侧章 -->
				<div class="xindanBox">
					<div class="topBox">
           <div class="billNo">
           <div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单号:</div>
            	<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
            		{{finCreditBill.creditBillNo }}</div>
            </div>
						<div class="toptitle">
							<div
								style="text-align: center;font-size: 23px;border-bottom: 1px solid #555555;margin-top: 10px;height: 40px;">
								惠单</div>
							<div style="text-align: center;font-size: 14px;margin-top: 20px;">
								开单日期：{{finCreditBill.openDate}}
							</div>
						</div>
						<div class="orderNo">
							<div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单状态:</div>
							<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
								{{finCreditBill.status|billStatusFilter}}</div>
						</div>
					</div>
					<div>
						<table width="90%" height="300" border="1" style="border-collapse: collapse;margin: 0 auto;">
							<tr>
								<th scope="col" width="15%">开单方</th>
								<th scope="col" width="35%">{{finCreditBill.buyerName}}</th>
								<th scope="col" width="15%">持单方</th>
								<th scope="col" width="35%">{{finCreditBill.salerName}}</th>
							</tr>
							<tr>
								<td>兑付日期</td>
								<td>{{finCreditBill.openDate}}</td>
								<td>期限</td>
								<td>{{finCreditBill.validateLength}}天</td>
							</tr>
							<tr>
								<td>金额</td>
								<td>
									<div style="display: flex;">
										<div>
											<p>人民币</p>
											<p>(大写)</p>
										</div>
										<h3 style="line-height: 50px;">{{value}}</h3>
									</div>

								</td>
								<td height="50" colspan="2">
									<table border="1" width="100%">
										<tr style="width: 100%;" height="50px">
											<th>亿</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>万</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>元</th>
										</tr>
										<tr height="50px">
											<td>{{a}}</td>
											<td>{{b}}</td>
											<td>{{c}}</td>
											<td>{{d}}</td>
											<td>{{e}}</td>
											<td>{{f}}</td>
											<td>{{g}}</td>
											<td>{{h}}</td>
											<td>{{i}}</td>
										</tr>
									</table>
								</td>
							<tr>
								<td>保贴方</td>
								<td>{{finCreditBill.baoliReceiverName}}</td>
								<td>兑付方式</td>
								<td>{{finCreditBill.paymentType}}</td>
							</tr>
							<tr>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">开单方承诺：本惠单到期无条件兑付</div>
										<img src="../../../assets/img/pass.png" width="100px" height="100px">
									</div>
								</td>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">保贴方承诺：为本惠单无条件保贴</div>
									</div>
								</td>
							</tr>
							</tr>
						</table>
					</div>
				</div>
				<!-- 	<div style="margin: 0 auto;">
    			<el-button @click="goBack">上一步</el-button>
    			<el-button @click="confirm" type="primary">确认提交</el-button>
    		</div> -->
			</div>
			<div v-else-if="finCreditBill.status == 'RECPT'" class="imgBg">
				<!-- 要左侧章 -->
				<div class="xindanBox">
					<div class="topBox">
						<div class="billNo">
						<div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单号:</div>
						 	<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
						 		{{finCreditBill.creditBillNo }}</div>
						 </div>
							<div class="toptitle">
							<div
								style="text-align: center;font-size: 23px;border-bottom: 1px solid #555555;margin-top: 10px;height: 40px;">
								惠单</div>
							<div style="text-align: center;font-size: 14px;margin-top: 20px;">
								开单日期：{{finCreditBill.openDate}}
							</div>
						</div>
						<div class="orderNo">
							<div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单状态:</div>
							<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
								{{finCreditBill.status|billStatusFilter}}</div>
						</div>
					</div>
					<div>
						<table width="90%" height="300" border="1" style="border-collapse: collapse;margin: 0 auto;">
							<tr>
								<th scope="col" width="15%">开单方</th>
								<th scope="col" width="35%">{{finCreditBill.buyerName}}</th>
								<th scope="col" width="15%">持单方</th>
								<th scope="col" width="35%">{{finCreditBill.salerName}}</th>
							</tr>
							<tr>
								<td>兑付日期</td>
								<td>{{finCreditBill.openDate}}</td>
								<td>期限</td>
								<td>{{finCreditBill.validateLength}}天</td>
							</tr>
							<tr>
								<td>金额</td>
								<td>
									<div style="display: flex;">
										<div>
											<p>人民币</p>
											<p>(大写)</p>
										</div>
										<h3 style="line-height: 50px;">{{value}}</h3>
									</div>

								</td>
								<td height="50" colspan="2">
									<table border="1" width="100%">
										<tr style="width: 100%;" height="50px">
											<th>亿</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>万</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>元</th>
										</tr>
										<tr height="50px">
											<td>{{a}}</td>
											<td>{{b}}</td>
											<td>{{c}}</td>
											<td>{{d}}</td>
											<td>{{e}}</td>
											<td>{{f}}</td>
											<td>{{g}}</td>
											<td>{{h}}</td>
											<td>{{i}}</td>
										</tr>
									</table>
								</td>
							<tr>
								<td>保贴方</td>
								<td>{{finCreditBill.baoliReceiverName}}</td>
								<td>兑付方式</td>
								<td>{{finCreditBill.paymentType}}</td>
							</tr>
							<tr>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">开单方承诺：本惠单到期无条件兑付</div>
										<img src="../../../assets/img/pass.png" width="100px" height="100px">
									</div>
								</td>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">保贴方承诺：为本惠单无条件保贴</div>
									</div>
								</td>
							</tr>
							</tr>
						</table>
					</div>
				</div>
				<!-- 	<div style="margin: 0 auto;">
    			<el-button @click="goBack">上一步</el-button>
    			<el-button @click="confirm" type="primary">确认提交</el-button>
    		</div> -->
			</div>
			<div v-else-if="finCreditBill.status == 'DENY'" class="imgBg">
				<!-- 要左侧章 -->
				<div class="xindanBox">
					<div class="topBox">
						<div class="billNo">
						<div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单号:</div>
						 	<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
						 		{{finCreditBill.creditBillNo }}</div>
						 </div>
						<div class="toptitle">
							<div
								style="text-align: center;font-size: 23px;border-bottom: 1px solid #555555;margin-top: 10px;height: 40px;">
								惠单</div>
							<div style="text-align: center;font-size: 14px;margin-top: 20px;">
								开单日期：{{finCreditBill.openDate}}
							</div>
						</div>
						<div class="orderNo">
							<div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单状态:</div>
							<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
								{{finCreditBill.status|billStatusFilter}}</div>
						</div>
					</div>
					<div>
						<table width="90%" height="300" border="1" style="border-collapse: collapse;margin: 0 auto;">
							<tr>
								<th scope="col" width="15%">开单方</th>
								<th scope="col" width="35%">{{finCreditBill.buyerName}}</th>
								<th scope="col" width="15%">持单方</th>
								<th scope="col" width="35%">{{finCreditBill.salerName}}</th>
							</tr>
							<tr>
								<td>兑付日期</td>
								<td>{{finCreditBill.openDate}}</td>
								<td>期限</td>
								<td>{{finCreditBill.validateLength}}天</td>
							</tr>
							<tr>
								<td>金额</td>
								<td>
									<div style="display: flex;">
										<div>
											<p>人民币</p>
											<p>(大写)</p>
										</div>
										<h3 style="line-height: 50px;">{{value}}</h3>
									</div>

								</td>
								<td height="50" colspan="2">
									<table border="1" width="100%">
										<tr style="width: 100%;" height="50px">
											<th>亿</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>万</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>元</th>
										</tr>
										<tr height="50px">
											<td>{{a}}</td>
											<td>{{b}}</td>
											<td>{{c}}</td>
											<td>{{d}}</td>
											<td>{{e}}</td>
											<td>{{f}}</td>
											<td>{{g}}</td>
											<td>{{h}}</td>
											<td>{{i}}</td>
										</tr>
									</table>
								</td>
							<tr>
								<td>保贴方</td>
								<td>{{finCreditBill.baoliReceiverName}}</td>
								<td>兑付方式</td>
								<td>{{finCreditBill.paymentType}}</td>
							</tr>
							<tr>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">开单方承诺：本惠单到期无条件兑付</div>
										<img src="../../../assets/img/pass.png" width="100px" height="100px">
									</div>
								</td>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">保贴方承诺：为本惠单无条件保贴</div>
									</div>
								</td>
							</tr>
							</tr>
						</table>
					</div>
				</div>
				<!-- 	<div style="margin: 0 auto;">
         			<el-button @click="goBack">上一步</el-button>
         			<el-button @click="confirm" type="primary">确认提交</el-button>
         		</div> -->
			</div>
			<div v-else class="imgBg">
				<!-- 要两个章 -->
				<div class="xindanBox">
					<div class="topBox">
						<div class="billNo">
						<div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单号:</div>
						 	<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
						 		{{finCreditBill.creditBillNo }}</div>
						 </div>
						<div class="toptitle">
							<div
								style="text-align: center;font-size: 23px;border-bottom: 1px solid #555555;margin-top: 10px;height: 40px;">
								惠单</div>
							<div style="text-align: center;font-size: 14px;margin-top: 20px;">
								开单日期：{{finCreditBill.openDate}}
							</div>
						</div>
						<div class="orderNo">
							<div style="font-weight: 700;font-size: 17px;margin-top: 30px;">惠单状态:</div>
							<div style="font-weight: 700;font-size: 17px;margin-top: 5px;">
								{{finCreditBill.status|billStatusFilter }}</div>
						</div>
					</div>
					<div>
						<table width="90%" height="300" border="1" style="border-collapse: collapse;margin: 0 auto;">
							<tr>
								<th scope="col" width="15%">开单方</th>
								<th scope="col" width="35%">{{finCreditBill.buyerName}}</th>
								<th scope="col" width="15%">持单方</th>
								<th scope="col" width="35%">{{finCreditBill.salerName}}</th>
							</tr>
							<tr>
								<td>兑付日期</td>
								<td>{{finCreditBill.openDate}}</td>
								<td>期限</td>
								<td>{{finCreditBill.validateLength}}天</td>
							</tr>
							<tr>
								<td>金额</td>
								<td>
									<div style="display: flex;">
										<div>
											<p>人民币</p>
											<p>(大写)</p>
										</div>
										<h3 style="line-height: 50px;">{{value}}</h3>
									</div>

								</td>
								<td height="50" colspan="2">
									<table border="1" width="100%">
										<tr style="width: 100%;" height="50px">
											<th>亿</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>万</th>
											<th>千</th>
											<th>百</th>
											<th>十</th>
											<th>元</th>
										</tr>
										<tr height="50px">
											<td>{{a}}</td>
											<td>{{b}}</td>
											<td>{{c}}</td>
											<td>{{d}}</td>
											<td>{{e}}</td>
											<td>{{f}}</td>
											<td>{{g}}</td>
											<td>{{h}}</td>
											<td>{{i}}</td>
										</tr>
									</table>
								</td>
							<tr>
								<td>保贴方</td>
								<td>{{finCreditBill.baoliReceiverName}}</td>
								<td>兑付方式</td>
								<td>{{finCreditBill.paymentType}}</td>
							</tr>
							<tr>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">开单方承诺：本惠单到期无条件兑付</div>
										<img src="../../../assets/img/pass.png" width="100px" height="100px">
									</div>
								</td>
								<td colspan="2">
									<div style="display: flex;">
										<div style="line-height: 100px;">保贴方承诺：为本惠单无条件保贴</div>
										<img src="../../../assets/img/pass.png" width="100px" height="100px">
									</div>
								</td>
							</tr>
							</tr>
						</table>
					</div>
				</div>
				<!-- <div style="margin: 0 auto;">
    			<el-button @click="goBack">上一步</el-button>
    			<el-button @click="confirm" type="primary">确认提交</el-button>
    		</div> -->
			</div>
			<div @click="centerDialogVisible = true" style="color: #1890FF;text-align: center;margin-top: 20px;font-size: 18px;"><el-checkbox v-model="checked">请您阅读并同意</el-checkbox>《惠企链惠单平台开具协议》
			</div>
      <div @click="centerDialogTwoVisible = true" style="color: #1890FF;text-align: center;margin-top: 20px;font-size: 18px;"><el-checkbox v-model="checked">请您阅读并同意</el-checkbox>《惠企链惠单保贴协议》
      </div>
			<el-dialog title="惠企链惠单平台惠单开具协议" :visible.sync="centerDialogVisible" width="70%" center>
				<ul style="overflow:auto;height: 400px;width: 100%;border: 1px solid #EEEEEE;">
					<div>
						<div>合同编号【{{finCreditBill.contractNo}}】</div>
						<div>惠企链惠单平台惠单开具协议</div>

						 签署日期【 {{finCreditBill.openDate}}】

						开单人：  {{finCreditBill.buyerName}}         （简称“甲方”）

						原始持单人：  {{finCreditBill.receiverName}}          （简称“乙方”）

						本《惠企链惠单平台惠单开具协议》（以下简称“本协议”）由甲乙双方根据《中华人民共和国民法典》等法律法规及规章的规定，本着互惠互利、平等自愿、诚实信用的原则，在充分协商的基础上根据本协议约定通过惠企链惠单平台签署。
						一、定义
						除本协议上下文另有所指外，本协议中的名词定义参照惠企链惠单平台（以下简称为“平台”）《惠企链惠单平台认证用户服务协议》。
						二、惠单要素
						合同编号：  {{finCreditBill.contractNo}}                                           ；
						惠单编号：   {{finCreditBill.creditBillNo}}                                         ；
						惠单金额：人民币                      （RMB  {{finCreditBill.amount}}      元）；
						三、惠单开具流程
						3.1甲方在签署本协议之前，已与授信机构签署了具体的授信协议。授信机构与甲方同意甲方根据《服务协议》，在惠企链惠单平台“我要开单”界面中记载的“可用额度”内，根据基础合同约定向惠企链惠单平台申请开具惠单。
						3.2甲方填写完毕惠单开具申请信息，勾选“【□请你阅读并同意《惠企链惠单平台惠单开具协议》】”，视为同意本协议全部内容，并自愿签署本协议。并提交至甲方的业务复核人员进行复核，复核通过后为有效的开单申请。
						3.3惠单开具申请生效后，惠企链惠单平台会向乙方发送签收惠单的通知，等待乙方签收。
						3.4乙方签收惠单时，应上传惠单项下应收账款的基础合同、相关发票、结算单据等相关资料，并在惠企链惠单平台相关页面勾选“【□请你阅读并同意《惠企链惠单平台惠单开具协议》】”，视为双方均同意本协议全部内容，并自愿签署本协议，本协议自动生效，乙方即签收成功。
						3.5乙方签收惠单成功后自动将该惠单提交给保贴机构（一般是授信机构）审核，保贴机构根据具体的授信协议，对乙方上传的惠单项下应收账款的基础合同、相关发票、结算单据等相关资料审核通过后，此时甲方惠单开具成功并由乙方成功持有惠单。
						四、惠单开具要点
						4.1甲方和乙方均勾选了本协议，视为甲方和乙方均同意本协议的条款，共同签署了本协议。乙方签收惠单的日期为本协议签署成立并生效之日，此时惠单开具申请视为有效。
						4.2乙方审核通过签收惠单后，视为甲方和乙方共同确认双方的债权债务关系，乙方为应收账款债权人，甲方为应收账款债务人，惠单所记载的信息为甲方和乙方之间在基础合同项下的应收账款信息。如惠单记载的金额、到期日与基础合同价款、到期日不一致的，视为甲方和乙方协商一致将基础合同价款、到期日变更为惠单记载的金额、到期日。
						4.3乙方通过惠企链惠单平台对甲方惠单开具申请进行“驳回”操作，或者未在确认有效期内进行惠单确认的，或签收上传的惠单项下应收账款的基础合同、相关发票、结算单据等相关资料未审核通过的，视为惠单开具不成功，各方就基础合同项下债权不得享有惠企链惠单平台的各项服务或进行各项操作。
						五、甲方和乙方共同对授信机构作如下的承诺和保证：
						5.1甲方和乙方均为惠企链惠单平台认证用户，双方承诺遵守《服务协议》。甲方和乙方各自在《服务协议》等项下的陈述和保证为本协议的一部分，其一旦违反将需承担《服务协议》和本协议项下的违约责任。
						5.2甲方和乙方确认各自具有签署本协议和履行本协议所规定各项义务的完整的合法资格，并取得了签署和履行本协议的所有内部及外部授权及批准（如需），本协议经签署后对协议各方是合法、有效、有约束力并可强制执行的。
						5.3甲方和乙方签署和履行本协议并不违反其所适用的任何法律、法规、规范性文件或政府机构的许可或批准，亦不违反任何对其有约束力的组织文件或其与任何第三方签订的任何合同或协议（或者已取得第三方的同意或认可）。
						5.4 甲方和乙方保证具有真实、合法的贸易关系，惠单对应的基础合同真实、合法、有效，不存在权利瑕疵，亦不存在对基础合同项下债权转移的限制（包括但不限于以该债权设定抵押或其他任何他项权）且从未曾向任何第三方转让。
						5.5惠单项下基础合同对应的债权债务关系系真实、合法、有效的，应收账款项下债权为唯一、具体、特定和排他的无争议合法债权。
						5.6应收账款债权不存在任何瑕疵，也不存在乙方行使权利的限制。
						六、甲方对惠企链惠单平台及授信机构作如下承诺和保证：
						6.1甲方同意《惠企链惠单平台惠单使用协议》的全部约定，保证在惠单到期日无条件履行付款义务。
						6.2未经授信机构书面同意，甲方与乙方不得私自对基础合同的任何内容做出变更、终止、宽延或放弃。
						6.3甲方在惠单项下的义务，未经授信机构的事前书面同意，不得以任何形式转让。否则，甲方同意接受授信机构对其账户及其在惠企链惠单平台用户权利采取的任何限制措施。
						6.4甲方因基础合同而获得的任何抗辩权，不得用于对抗授信机构以及因惠单转让、惠单融资而持有惠单的其他惠企链惠单平台认证用户。
						6.5甲方作为惠单项下的应收账款债务人，在惠单的有效期内，同意乙方在签收惠单后，有权将惠单的全部或部分转让给其自身的债权人或保贴机构等，通过惠单全部或部分转让，新持单人有权要求甲方履行付款责任，同时乙方不再享有向甲方追索已转让惠单项下款项的权利。惠企链惠单平台通过站内消息方式向甲方发送惠单项下的债权转让通知的，视为持单人就惠单项下的债权转让履行了通知债务人的义务。
						6.6在惠单的有效期内，如甲方出现破产、注销、撤销、作为重大诉讼的被告、重大债务无法偿还等可能影响甲方履约能力的行为，应及时通知授信机构。
						6.7在惠单有效期内，如甲方收到除惠企链惠单平台发出的任何形式的惠单转让通知、或类似效果的信息，或知晓、了解到其开具的惠单全部或部分权利被转让（通过惠企链惠单平台按照业务规则和指引进行转让的除外）的信息，应在收到、知晓该等信息后的 12 个小时内（如正常营业时间已结束，则在不超过 24 小时内）通知授信机构及惠企链惠单平台。
						6.8为保证惠单的流通性，如乙方未妥善履行基础合同项下义务的，在惠单开具后，甲方未经惠企链惠单平台同意不得主张惠单开具行为无效或可撤销，惠单到期后不得拒绝支付惠单项下款项，但甲方有权通过线下途径对乙方提出要求赔偿损失等不损害惠单流通性的追索。
						七、乙方向甲方、授信机构和惠企链惠单平台作如下承诺和保证：
						7.1乙方未对且将不会对应收账款债权设立抵押、质押或其他任何优先权益，且未曾向他人转让。
						7.2乙方在惠单项下的权利是可转让的，但乙方在惠单项下的权利仅可根据《服务协议》的约定，只能通过惠企链惠单平台进行线上转让、融资。
						7.3乙方根据《服务协议》的约定，在惠企链惠单平台转让其在惠单项下的权利的，应保证受让人知悉并遵守乙方在本协议项下的承诺和保证。
						7.4乙方签收惠单后，仍需按照基础合同要求履行基础合同项下义务。因基础合同导致应收账款出现瑕疵的，甲方在按照《服务协议》及本协议完成惠单付款后，可通过线下向乙方进行追索。
						7.5为保证惠单的流通性，如惠单对应的基础交易被证明是虚假的，乙方未经惠企链惠单平台同意不得主张惠单开具行为无效或可撤销。
						八、税费
						协议各方按照中国法律、行政法规、规章的规定承担各自因履行本协议而产生的相应税负，或承担履行代扣代缴义务。甲方和乙方因履行本协议过程中所产生的税负，除非本协议另有约定，应由甲方和乙方依法各自承担。
						九、保密
						为保证本协议的全面履行，协议各方承诺就其他方提供的所有资料中所包含的商业秘密和非公开信息严格保密，未经其他方同意不得向协议方、业务相关方以外的主体披露。无论本协议是否终止或解除，本条款持续有效。
						10、违约责任
						10.1甲方违反本协议第 5、6 条“承诺和保证”中的任一事项，或违反本协议其他约定义务的事项的，为甲方违约。
						10.2乙方违反本协议第5、7条“承诺和保证”中的任一事项，或违反本协议其他约定义务的事项的，为乙方违约。
						10.3甲方违约后，授信机构/持单人和惠企链惠单平台有权要求甲方限期纠正违约行为。如因甲方未按照惠单所列明的信息按期足额支付的，则授信机构/持单人作为惠单项下债权人，有权按照拖欠款项的额度、实际天数及违约金利率向甲方收取逾期利息，违约金利率为【每天万分之三】。
						10.4乙方违约后，授信机构有权要求乙方限期纠正违约行为。如因乙方违约（包括但不限于甲方与乙方串通捏造或隐瞒基础交易、基础合同信息、贸易背景不真实等）造成授信机构无法向甲方追索债权导致资金损失的，授信机构有权向乙方进行追索本金及利息。
						10.5授信机构有权根据违约方的违约情况，向惠企链惠单平台汇报并向惠企链惠单平台申请:
						10.5.1对其采取限制或暂停使用惠企链惠单平台服务，暂停或关闭用户账户；
						10.5.2在惠企链惠单平台公示违约方的违约情况；
						10.5.3有权向有关监管机构汇报该用户的违约情况；
						10.5.4依法保留追究该用户违约责任的权利。
						十一、通知
						除本协议和《服务协议》另有约定外，本协议项下任何一方向对方发出的通知、信件、数据电文等，应当发送至本协议约定的地址、联系人。一方当事人变更名称、地址、联系人或通信终端的，应当在变更后【3】日内及时通知对方当事人，对方当事人实际收到变更通知前的送达仍为有效送达。电子送达与书面送达具有同等法律效力。
						十二、反贿赂条款
						合同各方都清楚并愿意一致严格遵守中华人民共和国反贪污贿赂的法律规定，各方都清楚任何形式贪污和贿赂的行为都将触犯法律，任何一方违反规定都将受到法律的严惩。
						十三、适用法律及争议的解决
						13.1本协议的订立、效力、解释、执行以及争议解决均适用中华人民共和国法律，排除其他冲突法。
						13.2因本协议引起的或与本协议有关的任何争议，应首先由协议各方协商解决，【60】）日内协商不成的，任何一方均有权向惠企链惠单平台住所地（即【山东】省【济南】市【历下】区）有管辖权的人民法院起诉。
						13.3当产生任何争议及任何争议正按前条规定进行解决时，除争议事项外，协议各方应继续行使本协议项下的其他权利，履行本协议项下的其他义务。如本协议中的任何条款被认定为全部或部分不合法、无效或不可强制执行，并不影响其他条款的效力和可执行性。
						十四、其他
						14.1本协议自乙方根据本协议，对惠单进行确认签收之日起成立并生效。
						14.2协议各方应秉承诚实信用之原则，采取一切必要的行为以确保本协议之生效及获完全执行，并避免采取任何与本协议条款不一致的行为。
						14.3除非本协议另有约定，本协议生效后，任何一方不得单方面变更或解除本协议；对本协议的任何修改或变更必须经协议各方协商一致，并达成书面协议。
						14.4本协议未尽之事宜，如《服务协议》已有约定或惠企链惠单平台业务规则已有规定的，适用《服务协议》的约定或相应的业务规则规定。否则，由协议各方另行协商并签订补充协议解决，另行签订的补充协议与本协议具有同等法律效力。
						14.5如遇国家法律、法规或政策变化，致使本协议中的全部或部分条款不再符合国家法律、法规或政策的要求，并不影响本协议的有效和执行。
						14.6 本协议及其修改或补充均采用通过惠企链惠单平台以电子文本形式制成，可以有一份或者多份并且每一份具有同等法律效力，并保存在惠企链惠单平台为此设立的专用服务器上备查和保管。协议各方均认可该形式的协议效力。

						（以下无正文）
						甲方： {{finCreditBill.buyerName}}    	乙方： {{finCreditBill.receiverName}}

					</div>
				</ul>
				<span slot="footer" class="dialog-footer">
					<!-- <el-button @click="centerDialogVisible = false">取 消</el-button> -->
					<el-button type="primary" @click="centerDialogVisible = false">确 定</el-button>
				</span>
			</el-dialog>
      <el-dialog title="惠企链惠单平台惠单保贴协议" :visible.sync="centerDialogTwoVisible" width="70%" center>
      	<ul style="overflow:auto;height: 400px;width: 100%;border: 1px solid #EEEEEE;">
      		<div>
      			<div>合同编号【{{finCreditBill.contractNo}}】</div>
      			<div>惠企链惠单平台惠单保贴协议</div>

      			 签署日期【 {{finCreditBill.openDate}}】

      			持单人：  {{finCreditBill.receiverName}}         （简称“甲方”）

      			保贴机构：  {{finCreditBill.receiverName}}          （简称“乙方”）

      			协议各方一致同意，按照本协议规定的条件和条款，甲方以其持有的惠单向乙方申请惠单保贴，但本次惠单保贴不涉及惠单项下的各项权利的转让。为明确各方权利义务，特签署本协议。
      			一、定义
      			除本协议上下文另有所指外，本协议中的名词定义参照惠企链惠单平台（简称“平台”）《惠企链惠单平台认证用户服务协议》。
      			二、惠单保贴及审核
      			2.1惠单保贴
      			2.1.1惠单只能在平台上进行保贴操作。
      			2.1.2甲方点击“【□请你阅读并同意《惠企链惠单平台惠单保贴协议》】”，视为甲方以该笔惠单向乙方申请保贴，且同意本协议全部内容，并自愿签署本协议。
      			2.2惠单保贴审核通过
      			2.2.1惠单保贴申请无需平台审核，直接流转至乙方。
      			2.2.2乙方点击“【□请你阅读并同意《惠企链惠单平台惠单保贴协议》】”，则视为通过保贴申请，为惠单提供保贴服务，且乙方同意本协议全部内容，并自愿签署本协议。
      			2.3惠单保贴通过后，平台自动将保贴信息记载于惠单之上。
      			2.4惠单编号：
      			三、保贴服务
      			3.1乙方审核通过甲方提交的保贴申请后，为甲方提交的惠单提供保贴服务，即乙方承诺自保贴申请审核通过之日起至惠单到期前【3】个工作日（含）止，保贴机构接受保贴惠单的融资申请，利率以融资申请日保贴机构公告的利率为准；距离到期日不足【3】个工作日的保贴惠单，保贴机构可以接受保贴惠单的融资申请，也可以有权拒绝保贴惠单的融资申请。
      			四、承诺与保证
      			4.1本协议甲乙双方在此相互承诺和保证如下：
      			4.1.1  双方均为平台认证用户，双方承诺遵守《惠企链惠单平台认证用户服务协议》。双方各自在《惠企链惠单平台认证用户服务协议》项下的陈述和保证为本协议的一部分，其一旦违反将需承担《XXX平台认证用户服务协议》和本协议项下的违约责任。
      			4.1.2  双方各自具有签署本协议和履行本协议所规定各项义务的完整的合法资格，并取得了签署和履行本协议的所有内部授权及批准，本协议经签署后对双方是合法、有效、有约束力的。
      			4.1.3 双方签署和履行本协议并不违反其所适用的任何法律、法规、规范性文件或政府机构的许可或批准，亦不违反任何对其有约束力的组织文件或其与任何第三方签订的任何合同或协议（或者已取得第三方的同意或认可）。
      			4.2为保证本协议的全面履行，甲方承诺所申请保贴的惠单真实、合法、有效，惠单项下债权未曾与债务人（即开单人）有约定抵销、禁止或限制转让等事宜；在乙方通过保贴申请后，甲方、开单人、乙方不得对惠单项下债权的任何内容做出变更、终止、宽延或放弃。
      			五、保密
      			为保证本协议的全面履行，双方承诺就对方提供的所有资料中所包含的商业秘密和非公开信息严格保密，未经对方同意不得向第三方披露。无论本协议是否终止或解除，本条款在保密期限内持续有效。
      			六、违约责任
      			6.1 甲方违反本协议第四条“承诺和保证”中的任一事项，或违反本协议其他约定义务的事项的，为甲方违约。
      			6.2  乙方违反本协议约定的，为乙方违约。
      			6.3  一方违反本协议约定的，守约方有权要求违约方承担根据法律、法规的规定承担违约责任的权利。任何一方的违约行为造成其他方损失的，应承担相关损害赔偿责任。
      			七、适用法律及争议的解决
      			7.1  本协议的订立、效力、解释、执行以及争议解决均适用中华人民共和国法律。
      			7.2  凡因本协议引起的或与本协议有关的任何争议，应首先由双方协商解决，【60】日内协商不成的，任何一方均有权将该争议向乙方住所地（即【山东】省【济南】市【历城】区）有管辖权的人民法院起诉。
      			7.3当产生任何争议及任何争议正按前条规定进行解决时，除争议事项外，双方应继续行使本协议项下的其他权利，履行本协议项下的其他义务。如本协议中的任何条款被认定为全部或部分不合法、无效或不可强制执行，并不影响其他条款的有效和执行。
      			八、其他
      			8.1本协议采用电子文本形式制成，自乙方根据《惠企链惠单平台认证用户服务协议》及相关业务规则对惠单保贴申请审核通过之日起成立并生效。本协议留存于为此设立的专用服务器上备查，甲、乙双方均确认本协议的真实性和完整性，并认可该形式协议的法律效力。
      			8.2 本协议未尽之事宜，如《惠企链惠单平台认证用户服务协议》及平台规则、指引已有约定的，适用《惠企链惠单平台认证用户服务协议》及平台规则、指引的约定。
      			8.3 双方应秉承诚实信用之原则，采取一切必要的行为以确保本协议之生效及获完全执行，并避免采取任何与本协议条款不一致的行为。
      			8.4、如遇国家法律、法规或政策变化，致使本协议中的全部或部分条款不再符合国家法律、法规或政策的要求，并不影响本协议的有效和执行。
      			8.5 本协议生效后，任何一方不得单方面变更或解除本协议；对本协议的任何修改或变更必须经协议双方及平台协商一致，并达成书面协议。
      			（以下无正文）
      			甲方： {{finCreditBill.buyerName}}    	乙方： {{finCreditBill.receiverName}}

      		</div>
      	</ul>
      	<span slot="footer" class="dialog-footer">
      		<!-- <el-button @click="centerDialogVisible = false">取 消</el-button> -->
      		<el-button type="primary" @click="centerDialogTwoVisible = false">确 定</el-button>
      	</span>
      </el-dialog>
	<el-row>
    <div v-if="finCreditBill.status == 'CREATED'" >
				<el-col span="12" class="rowBox">
				         <el-form :model="proveDialogData" label-position="right" label-width="120px" class="dialog_form">
				           <el-form-item label="复核结果：">
				             <el-select v-model="proveDialogData.proveStatus" placeholder="请选择" clearable size="mini">
				               <el-option v-for="option in  options.proveOptions" :key="option.key" :label="option.label" :value="option.key" />
				             </el-select>
				           </el-form-item>
				           <el-form-item label="复核备注：">
				             <el-input v-model="proveDialogData.remark" />

				           </el-form-item>
				         </el-form>
				<div style="text-align: center;margin-top: 20px;">
		            <el-button @click="handleCancel">返回</el-button>
				           <el-button type="primary" icon="el-icon-edit" size="small" @click="confirmProveDialog()">提交复核</el-button>
				</div>
							</el-col></div>
      <div v-else-if="finCreditBill.status == 'CHECKED'" >
        <el-col span="12" class="rowBox">
                 <el-form :model="proveDialogData" label-position="right" label-width="120px" class="dialog_form">
                   <el-form-item label="签收结果：">
                     <el-select v-model="proveDialogData.proveStatus" placeholder="请选择" clearable size="mini">
                       <el-option v-for="option in  options.receOptions" :key="option.key" :label="option.label" :value="option.key" />
                     </el-select>
                   </el-form-item>
                   <el-form-item label="签收备注：">
                     <el-input v-model="proveDialogData.remark" />

                   </el-form-item>
                 </el-form>
        <div style="text-align: center;margin-top: 20px;">
                <el-button @click="handleCancel">返回</el-button>
                   <el-button type="primary" icon="el-icon-edit" size="small" @click="confirmReceDialog()">签收</el-button>
        </div>
        			</el-col></div>
				<el-col span="12" class="rowBox">
					<el-row>
            <span style="float: left;margin-top:20px;margin-left:180px;font-size: 15px;">辅助材料-合同及发票</span>
            <div style="float: right;margin-top:20px;">
							<el-button type="primary" icon="el-icon-edit" size="small" @click="openUploadDialog">添加辅助材料</el-button>
						<!-- 	<el-button type="danger" icon="el-icon-delete" size="small" @click="">删除辅助材料</el-button>
						 --></div>
					</el-row>
					<el-row>
						<el-table ref="itemTable" :data="finCreditBill.attachments"
							style="float: right;width: 80%;margin-top: 10px;" height="210" border>
              <el-table-column label="序号" type="index" align="center" />
							<el-table-column label="文件名称" align="center">
								<template slot-scope="scope">
									{{ scope.row.name }}
								</template>
							</el-table-column>
							<el-table-column label="" align="center" show-overflow-tooltip width="90">
								<template slot-scope="scope">
									<el-button type="text" @click="handleView(scope.row.name)">查看</el-button>
								</template>
							</el-table-column>
							<el-table-column label="操作" align="center" show-overflow-tooltip width="90">
								<template slot-scope="scope">
									<el-button type="text" @click="handlePrintDoc(scope.row.name)">打印</el-button>
								</template>
							</el-table-column>
							<el-table-column label="" align="center" show-overflow-tooltip width="90">
								<template slot-scope="scope">
									<el-button type="text" @click="handleDownload(scope.row.name)">下载</el-button>
								</template>
							</el-table-column>
						</el-table>
					</el-row>
				</el-col>
			</el-row>
		</div>


<el-dialog :title="uploadDialog.title" :visible.sync="uploadDialog.visible" width="400px" append-to-body>
      <div>
        <el-upload
          ref="upload"
          :limit="1"
          :multiple="false"
          :headers="uploadData.headers"
          :action="uploadData.url"
          :disabled="uploadData.isUploading"
          :on-progress="handleFileUploadProgress"
          :on-success="handleFileSuccess"
          :on-error="handleFileError"
          :auto-upload="true"
          :show-file-list="false"
          drag
        >
          <i class="el-icon-upload" />
          <div class="el-upload__text">
            将文件拖到此处，或
            <em>点击上传</em>
          </div>
          <div slot="tip" class="el-upload__tip">

            <el-input v-model="attach.contractNo" placeholder="合同号" />
            <el-input v-model="attach.invoiceNo" placeholder="发票号" />
             <el-input v-model="attach.batchNo" placeholder="交易订单号" />
            <el-select v-model="attach.attachType" style="width: 100%" filterable clearable placeholder="请选择文件类型">
              <el-option v-for="option in options.attachmentTypeOptions" :key="option.key" :label="option.label" :value="option.key" />
            </el-select>
            <el-input v-model="attach.name" placeholder="请输入文件名称" />
          </div>
        </el-upload>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="confirmUploadDialog">确 定</el-button>
          <el-button @click="resetUploadDialog">取 消</el-button>
        </div>
      </div>
    </el-dialog>
	</div>
</template>

<script>
	import SupplierApi from '@/api/basic/SupplierApi';
	import CustomerApi from '@/api/basic/CustomerApi';
	import appConstant from '@/constant/AppConstant';
  import AuthUtils from '@/utils/AuthUtils';
	import FinCreditBillApi from '@/api/baoli/FinCreditBillApi';
  import FinItemAttachApi from '@/api/baoli/FinItemAttachApi'
	export default {
		name: 'OmsSalesOrderList',
		filters: {
			billStatusFilter(item) {
				const values = appConstant.proveStatusList.filter(value => value.key === item)
				if (values && values.length > 0) {
					return values[0].label
				} else {
					return ''
				}
			}
		},
		data() {
			return {
				centerDialogVisible: false,
        centerDialogTwoVisible: false,
				active: 1,
				value: '',
				name: '',
				options: {
					supplierIdOptions: [],
          proveOptions: appConstant.proveList,
           receOptions: appConstant.receOptionList,
					supplierOptions: [],
          attachmentTypeOptions: appConstant.attachmentTypeOptions,
				},
				creditInfor: {
					credit: '',
					creditLeft: '',
					frezeCredit: ''
				},
				finCreditBill: {
          attachments: [],
				},
        uploadDialog: {
          title: '附件上传',
          visible: false
        },
        uploadData: {
          headers: { Authorization: 'Bearer ' + AuthUtils.getToken() }, // 上传请求头
          url: process.env.VUE_APP_BASE_API + '/system/file/upload' // 上传的地址
        },
        proveDialog: {
          title: '复核',
          visible: false
        },
        proveDialogData: {
         proveStatus: null,
          remark: null,
         id: null
        },
        attachs: [],
        attach: {
          contractNo: null,
          batchNo: null,
          invoiceNo: null,
          attachType: null,
          name: null,
          isValid: 1
        },
				form: {
					salerNo: '',
					receiverNo: '',
					amount: '',
					openDate: '',
					validatedTo: '',
					contractNo: '',
					invoiceNo: '',
					remark: ''
				},
				a: '',
				b: '',
				c: '',
				d: '',
				e: '',
				f: '',
				g: '',
				h: '',
				i: '',
				dateBetween: '',
				rules: {
					receiverNo: [{
							required: true,
							message: '请输入收单企业',
							trigger: 'blur'
						},
						{
							min: 3,
							max: 25,
							message: '长度在 3 到 25 个字符',
							trigger: 'blur'
						}
					],
					invoiceNo: [{
							required: true,
							message: '请输入发票',
							trigger: 'blur'
						},
						{
							min: 3,
							max: 25,
							message: '长度在 3 到 25 个字符',
							trigger: 'blur'
						}
					]
				}
			}
		},
		created() {
			const id = this.$route.params.id
      this.proveDialogData.id= id
			if (id) {
				FinCreditBillApi.get(id).then(response => {
					this.finCreditBill = response.data
					this.smallToBig(this.finCreditBill.amount)
					this.a = parseInt(this.finCreditBill.amount / 100000000)
					this.b = parseInt(this.finCreditBill.amount % 100000000 / 10000000)
					this.c = parseInt(this.finCreditBill.amount % 100000000 % 10000000 / 1000000)
					this.d = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 / 100000)
					this.e = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 / 10000)
					this.f = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 /
						1000)
					this.g = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
						1000 / 100)
					this.h = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
						1000 % 100 / 10)
					this.i = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
						1000 % 100 % 10 / 1)
				})
			}

			this.loadOptions()
		},
		methods: {
			seeDetail() {

			},
      getAttachs() {
        FinItemAttachApi.list({ contractNo: this.attach.contractNo }).then(response => {
          this.attachs = response.data
         this.finCreditBill.attachments= response.data
        })
      },
      handleCancel() {
        this.$router.back()
      },
			goBack() {
				this.active = 1;
			},
			loadOptions() {
				let that = this;

				SupplierApi.list().then(res => {
					that.options.supplierIdOptions = res.data
					that.options.supplierOptions = res.data
				})
				CustomerApi.getMyCustInfor().then(response => {
					that.creditInfor.creditLeft = response.data.creditLeft
					that.creditInfor.credit = response.data.credit
					that.creditInfor.frezeCredit = response.data.frezeCredit
				})
			},
			confirm() {
				FinCreditBillApi.submit(this.form).then(res => {
					console.log(res)
				})
				this.active = 3;
				alert('提交成功')
				setTimeout(() => {
					this.active = 1;
				}, 1500);
				this.form = {
					salerNo: '',
					receiverNo: '',
					amount: '',
					openDate: '',
					validatedTo: '',
					contractNo: '',
					invoiceNo: '',
					remark: ''
				};
				this.dateBetween = '';
			},
			submitForm(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						for (let i in this.options.supplierOptions) {
							if (this.form.receiverNo == this.options.supplierOptions[i].id) {
								this.name = this.options.supplierOptions[i].supplierName
								// return
							}
						}
						this.a = parseInt(this.form.amount / 100000000)
						this.b = parseInt(this.form.amount % 100000000 / 10000000)
						this.c = parseInt(this.form.amount % 100000000 % 10000000 / 1000000)
						this.d = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 / 100000)
						this.e = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 / 10000)
						this.f = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 /
							1000)
						this.g = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
							1000 / 100)
						this.h = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
							1000 % 100 / 10)
						this.i = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
							1000 % 100 % 10 / 1)
						this.active = 2
						console.log(this.form.openDate)
						this.getDaysBetween(this.form.openDate, this.form.validatedTo)
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			// *
			//  * 计算两个日期之间的天数
			//  * @param dateString1  开始日期 yyyy-MM-dd
			//  * @param dateString2  结束日期 yyyy-MM-dd
			//  * @returns {number} 如果日期相同 返回一天 开始日期大于结束日期，返回0
			getDaysBetween(dateString1, dateString2) {
				var startDate = Date.parse(dateString1);
				var endDate = Date.parse(dateString2);
				if (startDate > endDate) {
					return 0;
				}
				if (startDate == endDate) {
					return 1;
				}
				var days = (endDate - startDate) / (1 * 24 * 60 * 60 * 1000);
				this.dateBetween = days
			},
			smallToBig(money) {
				//  将数字金额转换为大写金额
				var cnNums = new Array(
					"零",
					"壹",
					"贰",
					"叁",
					"肆",
					"伍",
					"陆",
					"柒",
					"捌",
					"玖"
				); //汉字的数字
				var cnIntRadice = new Array("", "拾", "佰", "仟"); //基本单位
				var cnIntUnits = new Array("", "万", "亿", "兆"); //对应整数部分扩展单位
				var cnDecUnits = new Array("角", "分", "毫", "厘"); //对应小数部分单位
				var cnInteger = "整"; //整数金额时后面跟的字符
				var cnIntLast = "元"; //整数完以后的单位
				//最大处理的数字
				var maxNum = 999999999999999.9999;
				var integerNum; //金额整数部分
				var decimalNum; //金额小数部分
				//输出的中文金额字符串
				var chineseStr = "";
				var parts; //分离金额后用的数组，预定义
				if (money == "") {
					return "";
				}

				money = parseFloat(money);
				if (money >= maxNum) {
					//超出最大处理数字
					return "超出最大处理数字";
				}
				if (money == 0) {
					chineseStr = cnNums[0] + cnIntLast + cnInteger;
					return chineseStr;
				}

				//四舍五入保留两位小数,转换为字符串
				money = Math.round(money * 100).toString();
				integerNum = money.substr(0, money.length - 2);
				decimalNum = money.substr(money.length - 2);

				//获取整型部分转换
				if (parseInt(integerNum, 10) > 0) {
					var zeroCount = 0;
					var IntLen = integerNum.length;
					for (var i = 0; i < IntLen; i++) {
						var n = integerNum.substr(i, 1);
						var p = IntLen - i - 1;
						var q = p / 4;
						var m = p % 4;
						if (n == "0") {
							zeroCount++;
						} else {
							if (zeroCount > 0) {
								chineseStr += cnNums[0];
							}
							//归零
							zeroCount = 0;
							chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
						}
						if (m == 0 && zeroCount < 4) {
							chineseStr += cnIntUnits[q];
						}
					}
					chineseStr += cnIntLast;
				}
				//小数部分
				if (decimalNum != "") {
					var decLen = decimalNum.length;
					for (var i = 0; i < decLen; i++) {
						var n = decimalNum.substr(i, 1);
						if (n != "0") {
							chineseStr += cnNums[Number(n)] + cnDecUnits[i];
						}
					}
				}
				if (chineseStr == "") {
					chineseStr += cnNums[0] + cnIntLast + cnInteger;
				} else if (decimalNum == "" || /^0*$/.test(decimalNum)) {
					chineseStr += cnInteger;
				}
				this.value = chineseStr;
				console.log(this.value)
			},
		openUploadDialog() {
		  this.resetUploadDialog()
		  this.uploadDialog.visible = true

		 this.attach.contractNo = this.finCreditBill.contractNo
		 this.attach.invoiceNo = this.finCreditBill.invoiceNo
		 this.attach.batchNo = this.finCreditBill.id
		},
		confirmUploadDialog() {
		  FinItemAttachApi.add(this.attach).then(response => {
		    this.$message.success('附件添加成功')
		    this.uploadDialog.visible = false
		 //   this.getAttachs()
      	this.loadOptions()
     const id = this.$route.params.id
     if (id) {
     	FinCreditBillApi.get(id).then(response => {
     		this.finCreditBill = response.data
     		this.smallToBig(this.finCreditBill.amount)
     		this.a = parseInt(this.finCreditBill.amount / 100000000)
     		this.b = parseInt(this.finCreditBill.amount % 100000000 / 10000000)
     		this.c = parseInt(this.finCreditBill.amount % 100000000 % 10000000 / 1000000)
     		this.d = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 / 100000)
     		this.e = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 / 10000)
     		this.f = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 /
     			1000)
     		this.g = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
     			1000 / 100)
     		this.h = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
     			1000 % 100 / 10)
     		this.i = parseInt(this.finCreditBill.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
     			1000 % 100 % 10 / 1)
     	})
     }
		  })



		},
		handleFileUploadProgress(event, file, fileList) {
		  this.uploadData.isUploading = true
		},
		// 文件上传成功处理
		handleFileSuccess(response, file, fileList) {
		  this.uploadData.isUploading = false
		  if (response.code === 200) {
		    this.attach.name = response.data
		  }
		},
		// 文件上传失败处理
		handleFileError(response, file, fileList) {
		  this.uploadData.isUploading = false
		},
		resetUploadDialog() {
		  this.uploadDialog.visible = false
		  this.attach = {
		    contractNo: null,
		    invoiceNo: null,
		    attachType: null,
		    name: null,
		    isValid: 1
		 }
		 },
		handleView(fileName) {
		  if (fileName) {
		    const lowerStr = fileName.toLowerCase()
		    if (lowerStr.endsWith('.doc') || lowerStr.endsWith('.docx')) {
		      window.open(`#/file/word/${fileName}?isPrint=0`)
		    }
		    if (lowerStr.endsWith('.xls') || lowerStr.endsWith('.xlsx')) {
		      window.open(`#/file/excel/${fileName}?isPrint=0`)
		    }
		    if (lowerStr.endsWith('.pdf')) {
		      window.open(process.env.VUE_APP_ATTACHMENT_URL + fileName)
		    }
		    if (lowerStr.endsWith('.txt')) {
		      window.open(`#/file/txt/${fileName}?isPrint=0`)
		    }
		    if (lowerStr.endsWith('.jpg') || lowerStr.endsWith('.jpeg') || lowerStr.endsWith('.png')) {
		      window.open(`#/file/img/${fileName}?isPrint=0`)
		    }
		  }
		},
    confirmReceDialog() {
        const params = {
          status: this.proveDialogData.proveStatus,
          remark: this.proveDialogData.remark,
          id: this.proveDialogData.id
       }
       if(this.proveDialogData.proveStatus==null||this.proveDialogData.proveStatus==""){
         this.$alert("请选择签收或拒绝！");
         return;
       }
       if(this.finCreditBill.contractUploadYn==null||this.finCreditBill.contractUploadYn==""){
         this.$alert("签收之前必须上传合同！");
         return;
       }
       if(this.finCreditBill.invoiceNo!=null&&this.finCreditBill.invoiceNo!=""){
         if(this.finCreditBill.invoiceUploadYn==null||this.finCreditBill.invoiceUploadYn==""){
           this.$alert("签收之前必须上传发票！");
            return;
         }
       }
        FinCreditBillApi.receive(params).then(() => {
          this.$message.success('签收成功!')

        })
          this.$router.go(-1)
    },
    confirmProveDialog() {
        const params = {
          status: this.proveDialogData.proveStatus,
          remark: this.proveDialogData.remark,
          id: this.proveDialogData.id
       }
       if(this.proveDialogData.proveStatus==null||this.proveDialogData.proveStatus==""){
         this.$alert("请选择复核通过或不通过！");
         return;
       }
        FinCreditBillApi.prove(params).then(() => {
          this.$message.success('复核成功!')
          this.closeProveDialog()
        })
             this.$router.go(-1)
    },
		handlePrintDoc(fileName) {
		  if (fileName) {
		    const lowerStr = fileName.toLowerCase()
		    if (lowerStr.endsWith('.doc') || lowerStr.endsWith('.docx')) {
		      window.open(`#/file/word/${fileName}?isPrint=1`)
		    }
		    if (lowerStr.endsWith('.xls') || lowerStr.endsWith('.xlsx')) {
		      window.open(`#/file/excel/${fileName}?isPrint=1`)
		    }
		    if (lowerStr.endsWith('.pdf')) {
		      window.open(process.env.VUE_APP_ATTACHMENT_URL + fileName)
		    }
		    if (lowerStr.endsWith('.txt')) {
		      window.open(`#/file/txt/${fileName}?isPrint=1`)
		    }
		    if (lowerStr.endsWith('.jpg') || lowerStr.endsWith('.jpeg') || lowerStr.endsWith('.png')) {
		      window.open(`#/file/img/${fileName}?isPrint=1`)
		    }
		  }
		},
		handleDownload(fileName) {
		  this.$common.download(process.env.VUE_APP_ATTACHMENT_URL + fileName)
		}


    }
	}


</script>
<style scoped>
	.imgBg {
		width: 80%;
		margin: 0 auto;
		height: 430px;
		background-image: url("../../../assets/img/wenli.png");
		/*background: url("img/2.jpg") 10% 20% no-repeat;!*图片从左往右移动的百分比大小，从上往下百分比大小，重复方式
		                                                            换成数值同样如此，在这里没有调整大小的方法*!*/
		/*这个是按从左往右，从上往下的百分比位置进行调整*/
		background-size: 100% 100%;
		/*按比例缩放*/
		/*background-size: 100px 100px;!*这个是按数值缩放*!*/
		background-repeat: no-repeat;
		/*还有repeat-x,y等*/
	}

	.xindanBox {
		width: 95%;
		height: 450px;
		margin: 0 auto;
	}

	.topBox {
		display: flex;

	}
	.toptitle {
		height: 100px;
		width: 50%;
		margin: 0 auto;
		margin-left: 10%;
	}
	.title {
		height: 100px;
		width: 40%;
		margin: 0 auto;
		margin-left: 30%;
	}
	.billNo {
		height: 100px;
		width: 20%;
		margin-left: 50px;
	}
	.orderNo {
		height: 100px;
		width: 30%;
		margin-left: 50px;
	}

	.moneyBox {
		display: flex;
		height: 50px;
		width: 100%;
	}

	.moneyChildBox {
		width: 25%;
		height: 50px;
	}

	.textAlLine {
		text-align: center;
	}

	.eduTitle {
		/* margin-top: 30px; */
		color: #818181;
		font-size: 15px;
	}

	.redColor {
		color: #fd0000;
	}

	.titleNumber {
		margin-top: 10px;
		font-weight: bold;
	}

	.contentBox {
		width: 50%;
		margin: 0 auto;
		/* height: 300px; */
	}
</style>
